<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Grid 栅格</title>
    <link rel="stylesheet" type="text/css" href="../css/mview.css?v=20230607111">
</head>
<body>
    <div class="">
        <div class="mview-grid-item m-mb-1 m-text-center m-gap-2">
            <div class="m-col-1 m-btn-primary">1</div>
            <div class="m-col-1 m-btn-primary">1</div>
            <div class="m-col-1 m-btn-primary">1</div>
            <div class="m-col-1 m-btn-primary">1</div>
            <div class="m-col-1 m-btn-primary">1</div>
            <div class="m-col-1 m-btn-primary">1</div>
            <div class="m-col-1 m-btn-primary">1</div>
            <div class="m-col-1 m-btn-primary">1</div>
            <div class="m-col-1 m-btn-primary">1</div>
            <div class="m-col-1 m-btn-primary">1</div>
            <div class="m-col-1 m-btn-primary">1</div>
            <div class="m-col-1 m-btn-primary">1</div>
        </div>
        <div class="mview-grid-item m-mb-1 m-text-center m-gap-2">
            <div class="m-col-2 m-btn-primary">2</div>
            <div class="m-col-2 m-btn-primary">2</div>
            <div class="m-col-2 m-btn-primary">2</div>
            <div class="m-col-2 m-btn-primary">2</div>
            <div class="m-col-2 m-btn-primary">2</div>
            <div class="m-col-2 m-btn-primary">2</div>
        </div>
        <div class="mview-grid-item m-mb-1 m-text-center m-gap-2">
            <div class="m-col-3 m-btn-primary">3</div>
            <div class="m-col-3 m-btn-primary">3</div>
            <div class="m-col-3 m-btn-primary">3</div>
            <div class="m-col-3 m-btn-primary">3</div>
        </div>
        <div class="mview-grid-item m-mb-1 m-text-center m-gap-2">
            <div class="m-col-4 m-btn-primary">4</div>
            <div class="m-col-4 m-btn-primary">4</div>
            <div class="m-col-4 m-btn-primary">4</div>
        </div>
        <div class="mview-grid-item m-mb-1 m-text-center m-gap-2">
            <div class="m-col-6 m-btn-primary">6</div>
            <div class="m-col-6 m-btn-primary">6</div>
        </div>
        <div class="mview-grid-item m-mb-1 m-text-center m-gap-2">
            <div class="m-col-12 m-btn-primary">12</div>
        </div>

        <div class="m-row m-mb-1 m-text-center m-gap-2">
            <div class="mg-col-3 m-btn-primary">3</div>
            <div class="mg-col-3 m-btn-primary">3</div>
            <div class="mg-col-3 m-btn-primary">3</div>
            <div class="mg-col-3 m-btn-primary">3</div>
        </div>
    </div>

    <div class="">
        <div class="mview-grid-item m-mb-1 m-text-center m-gap-2">
            <div class="m-col-1 m-btn-primary">m-col-1</div>
            <div class="m-col-1 m-btn-primary">m-col-1</div>
            <div class="m-col-1 m-btn-primary">m-col-1</div>
            <div class="m-col-1 m-btn-primary">m-col-1</div>
            <div class="m-col-1 m-btn-primary">m-col-1</div>
            <div class="m-col-1 m-btn-primary">m-col-1</div>
            <div class="m-col-1 m-btn-primary">m-col-1</div>
            <div class="m-col-1 m-btn-primary">m-col-1</div>
            <div class="m-col-1 m-btn-primary">m-col-1</div>
            <div class="m-col-1 m-btn-primary">m-col-1</div>
            <div class="m-col-1 m-btn-primary">m-col-1</div>
            <div class="m-col-1 m-btn-primary">m-col-1</div>
        </div>
        <div class="mview-grid-item m-mb-1 m-text-center m-gap-2">
            <div class="m-col-2 m-btn-primary">m-col-2</div>
            <div class="m-col-2 m-btn-primary">m-col-2</div>
            <div class="m-col-2 m-btn-primary">m-col-2</div>
            <div class="m-col-2 m-btn-primary">m-col-2</div>
            <div class="m-col-2 m-btn-primary">m-col-2</div>
            <div class="m-col-2 m-btn-primary">m-col-2</div>
        </div>
        <div class="mview-grid-item m-mb-1 m-text-center m-gap-2">
            <div class="m-col-3 m-btn-primary">m-col-3</div>
            <div class="m-col-3 m-btn-primary">m-col-3</div>
            <div class="m-col-3 m-btn-primary">m-col-3</div>
            <div class="m-col-3 m-btn-primary">m-col-3</div>
        </div>
        <div class="mview-grid-item m-mb-1 m-text-center m-gap-2">
            <div class="m-col-4 m-btn-primary">m-col-4</div>
            <div class="m-col-4 m-btn-primary">m-col-4</div>
            <div class="m-col-4 m-btn-primary">m-col-4</div>
        </div>
        <div class="mview-grid-item m-mb-1 m-text-center m-gap-2">
            <div class="m-col-6 m-btn-primary">m-col-6</div>
            <div class="m-col-6 m-btn-primary">m-col-6</div>
        </div>
        <div class="mview-grid-item m-mb-1 m-text-center m-gap-2">
            <div class="m-col-12 m-btn-primary">m-col-12</div>
        </div>
    </div>
</body>
</html>